// vite.config.ts
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import postcssPxToViewport from 'postcss-px-to-viewport'
import Components from 'unplugin-vue-components/vite';
import { VantResolver } from '@vant/auto-import-resolver';

// PostCSS配置
const postcssConfig = {
  plugins: [
    postcssPxToViewport({
      viewportWidth: 750, // 视窗的宽度
      unitPrecision: 3, // 指定视窗单位换算后小数点后的精度
      viewportUnit: 'vw', // 指定需要转换成的视窗单位
      selectorBlackList: ['ignore', '.IGNORE'], // 需要忽略转换的类名
      minPixelValue: 1, // 小于或等于`1px`不转换为视窗单位
      mediaQuery: false, // 是否在媒体查询中也转换px
      exclude: /(\/|\\)(node_modules)(\/|\\)/, // 设置忽略目录
    }),
  ],
}

export default defineConfig({
  plugins: [
    vue(),
    Components({
      resolvers: [VantResolver()],
    }),
  ],
  css: {
    postcss: postcssConfig,
  },
})
